<template>
	<view class="page">
		<cu-custom bgColor="bg-jc">
			<block style="font-size: 22px;" slot="content">哈密市智慧消防</block>
		</cu-custom>
		<view class="banner bg-banner"></view>
		<view class="content-box">
			<view class="my-card">
				<view class="line"></view>
				<view class="my-card-box">
					<view v-if="hasTask" style="width: 100%;">
						<view class="nocomplete">
							<text class="cuIcon-daiwancheng"></text>
							待处理火情
						</view>
						<view class="title_body">
							<text class="title">{{ task.name }}</text>
						</view>
						<view class="task-content">
							<view class="card-content">
								<p class="text-card-title">确认人员：</p>
								<p class="text-card-info">{{ task.userName }}</p>
							</view>
							<view class="card-content">
								<p class="text-card-title">确认时间：</p>
								<p class="text-card-info">{{ task.fireConfirmTime }}</p>
							</view>
							<view class="card-content">
								<p class="text-card-title">企业名称：</p>
								<p class="text-card-info">{{ task.enterpriseName }}</p>
							</view>
							<view class="card-content">
								<p class="text-card-title">火情地址：</p>
								<p class="text-card-info">{{ task.loaction }}</p>
							</view>
							<view>
								<button @click="see_detail(task.ucId)" class="cu-btn round my-btn handle" >立即处理</button>
							</view>
						</view>
					</view>
					<view class="notask" v-else>
						<view class="nocomplete">
							暂无待处理火情
						</view>
						<view class="title_body">
						</view>
					</view>
				</view>

			</view>
					<view class="u-tools">
			<view>
				<text class="utools-title">任务管理</text>
				<view class="bg-2" style="" @click="jdjc">
					<p class="title-text"><text class="cuIcon-jiandujiancha2 jd-icon"></text></p>
					<p>
						<text class="tools-desc" style="color: #009C68;">监督检测</text>
					</p>
				</view>
			</view>
			<view>
				<text class="utools-title">主体管理</text>
				<view style="" class="bg-3" @click="qyxx">
					<p class="title-text"><text class="cuIcon-qiyexinxi qy-icon"></text></p>
					<p>
						<text class="tools-desc" style="color: #1A66FF;">企业信息</text>
					</p>

				</view>
			</view>
		</view>

		<view class="utools">
			<text class="utools-title">预警管理</text>
			<view class="uk">
				<view class="last_mk bg" style="" @click="hqxx">
					<view class="circle-last">
						<text class="cuIcon-huoqingxinxi icon"></text>
					</view>
					<view class="uk_title">
						<text>火情信息</text>
					</view>
				</view>
				<view class="last_mk bg" style="" @click="xfyh">
					<view class="circle-last">
						<text  class="cuIcon-xiaofangyinhuan icon"></text>
					</view>
					<view class="uk_title">
						<text>消防隐患</text>
					</view>
				</view>
				<view class="last_mk bg" style="" @click="wbgd">
					<view class="circle-last">
						<text  class="cuIcon-weibaogongdan icon"></text>
					</view>
					<view class="uk_title">
						<text>维保工单</text>
					</view>
				</view>
			</view>
		</view>
		</view>
		<message />
	</view>
</template>

<script>
import {
	isDateBetween,
	isEmpty
} from '@/common/formatDate.js'

export default {
	created() {
		console.info("ahome create")

		this.getTask()

		uni.$on('refreshPage', function () {
			this.getTask()
		})
	},
	onShow() {
		let s1 = "2022-03-29 10:30:00"
		let start = "2022-03-29 11:00:00"
		let end = "2022-03-29 11:30:00"
		let flag = isDateBetween(s1, start, end)
		console.info("ahome onShow")

	},
	data() {
		return {
			hasTask: false,
			task: '',
		}
	},
	methods: {

		getTask() {
			let that = this
			let params = {
				"pageNum": 1,
				"pageSize": 1,
				// "fireDrill": 0,
				"fireExecutionStatus": 0
			}
			// 请求数据
			let app = getApp()
			app.globalData.request({
				url: 'wx/fireInfo/getFireInfoPage',
				data: params
			}).then(function (res) {
				if (res.data.data.list.length > 0) {
					that.hasTask = true
					that.task = res.data.data.list[0]
				} else {
					that.hasTask = false
				}

			}).catch(function (e) {
				that.hasTask = false
			})
		},
		jdjc() {
			uni.navigateTo({
				url: '/jgbm/jcrw/jcrw'
			})
		},
		qyxx() {
			uni.navigateTo({
				url: '/jgbm/qyxx/qyxx'
			})
		},
		hqxx() {
			uni.navigateTo({
				url: '/jgbm/hqxx/hqxx'
			})
		},
		xfyh() {
			uni.navigateTo({
				url: '/jgbm/xfyh/xfyh'
			})
		},
		wbgd() {
			uni.navigateTo({
				url: '/jgbm/wbgd/wbgd'
			})
		},
		see_detail(ucId) {
			uni.navigateTo({
				url: '/yzqy/hqxq/hqxq?ucId=' + ucId
			});
		}

	}
}
</script>

<style scoped>
.page {
	height: 1460rpx;
}



.my-btn {
	float: right;
	font-size: 24rpx;
	color: #3013F7;
	height: 50rpx;
}




.u-tools {
	display: flex;
	flex-direction: row;
	margin-top: 20upx;
}

.tools-title {
	font-size: 32rpx;
	color: #333;
	font-weight: 600;
}

.title-text {
	text-align: center;
}

.qy-icon {
	text-align: center;
	font-size: 36px;
	color: #1A66FF;
}

.jd-icon {
	text-align: center;
	font-size: 36px;
	color: #30D8A6;
}

.tools-desc {
	text-align: center;
	font-size: 28rpx;
	color: #333333;
	font-weight: bolder;
}

.u-tools view {
	flex: 1;

}

.utools {
	margin-top: 40upx;
}

.utools-title {
	font-size: 32rpx;
	color: #333333;
	font-weight: 600;
}

.uk {
	display: flex;
	justify-content: space-between;
	flex-direction: row;
	margin-top: 20upx;
}

.uk view {
	/* width: 30%; */
	/* flex: 1; */
	/* height: 105upx;
		border-radius: 8px; */
}

.uk .last_mk {
	height: 160rpx;
	border-radius: 8px;
}

.uk text {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	padding-left: 90rpx;
	font-size: 28rpx;
	font-weight: 600;
}

.uk .last_mk text {
	height: 140rpx;
	color: #FA5151;
	display: flex;
	padding-left: 0;
	flex-direction: row;
	align-items: center;
}

.icon {
	height: 40px !important;
	font-size: 22px !important;
	padding-left: 0 !important;
	color: #FA5151;
}

.circle-last {
	transform: translateY(50%);
	margin: 0 auto;
	margin-top: -10px;
	width: 40px !important;
	height: 40px !important;
	background: #fff;
	border-radius: 50% !important;
}

.bg-2 {
	align-items: center;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	height: 120upx;
	border-radius: 8px;
	margin: 5px 5rpx 0 5rpx;
	background: rgba(131, 240, 175, 0.2);
	box-shadow: 0px 0px 12px 0px rgba(221, 221, 221, 0.25);
}

.bg-3 {
	align-items: center;
	display: flex;
	flex-direction: row;
	justify-content: space-around;
	height: 120upx;
	border-radius: 8px;
	margin: 5px 5rpx 0 5rpx;
	background: rgba(26, 102, 255, 0.2);
	box-shadow: 0px 0px 12px 0px rgba(221, 221, 221, 0.25);
}

.bg {
	width: 32%;
	height: 250px;
	background: rgba(250, 81, 81, 0.15);
	border-radius: 8px;
	color: #FA5151;
}

.zwrw {
	font-size: 32rpx;
}

.bg-banner {
	background-image: url('https://www.cetczhxf.com/mp3/home_bg_jg.png');
}

.line-bg {
	background: linear-gradient(90deg, #301FF1 3%, #301FF1 3%, #B11EF1 98%, #B11EF1 98%);
}
</style>
